<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="com.lkj.model.User" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Cache-Control" content="no-siteapp">
<link href="<%=request.getContextPath()%>/css/common.css" rel="stylesheet" />
<title>华纵科技</title>
<%--<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.min.js"></script>--%>
    <script src="<%=request.getContextPath()%>/js/common.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-1.8.3.min.js"></script>
    <link href="<%=request.getContextPath()%>/bootstrap/css/bootstrap.css" rel="stylesheet" />
    <script src="<%=request.getContextPath()%>/js/jquery.floatDiv.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/bootstrap-paginator.js"></script>
    <%
        User user = (User) request.getSession().getAttribute("user");
    %>
<script type="text/javascript">
var contextTemp;
var orderTemp;
$(function() {
    initPage("asc","",1);
   /*  $("#btn_search").click(function(){
        var search = $("#search").val();
        initPage(orderTemp,search,1);
    }) */
    $("#ssbtn").click(function(){
		var search = $("#ssinput").val();
		initPage(orderTemp,search,1);
	})
    $("#btn_page").click(function(){
        var search = $("#pageinp").val();
        if(search != ""){
            $("#pageform").submit();
        }else{
            alert("请输入跳转页码！");
            $("#pageinp").focus();
        }
    })

    $("#msg-box").floatdiv({top:"80px",left:"350px"});
    
    $(document).on("click",".updateBtn,.add,.searchBtn,.cleanBtn,.submit-btn,.video_li,.close-btn,.show",function(){
        var th = $(this);
        //查找按钮
        if(th.hasClass("searchBtn")){
         initPage(orderTemp,$("input[name='context']").val(),1);
        }
        //清空按钮
        if(th.hasClass("cleanBtn")){
         $("input[name='context']").val("");
         initPage(orderTemp,"",1);
        }

        <%--//修改提交按钮--%>
        <%--if(th.hasClass("updateBtn")){--%>
        <%--var datas = $("form").serialize();--%>
        <%--$.post("<%=request.getContextPath()%>/server/updateStatus",datas,function(data){--%>
            <%--alert(data.result);--%>
        <%--},"json");--%>
        <%--}--%>

        //修改提交按钮
        if(th.hasClass("submit-btn")){
            //$("#s_form").serialize()
            var datas = {};
            datas["serverid"] = $("input[name='serverid']").val();
            datas["servername"] = $("input[name='servername']").val();
            datas["serverip"] = $("input[name='serverip']").val();
            datas["filepath"] = $("input[name='filepath']").val();
            datas["admin"] = $("input[name='admin']").val();
            datas["remarks"] = $("textarea[name='remarks']").val();
            $.post("<%=request.getContextPath()%>/server/updateFileServer",datas,function(data){
                location.reload();
            },"json");
        }

        //弹框关闭
        if(th.hasClass("close-btn")){
            $(".submit-btn").hide();
            $("#msg-box").css("display","none");
        }
        if(th.hasClass("show")){
            var tdDoms = th.parent().parent().find("td");

            $("#s_form").find("input").val("");

            $("input[name='servername']").val($(tdDoms[2]).text());
            $("input[name='serverip']").val($(tdDoms[3]).text());
            $("input[name='filepath']").val($(tdDoms[4]).text());
            $("input[name='qwe']").val($(tdDoms[5]).text());
            $("input[name='admin']").val($(tdDoms[6]).text());
            $("textarea[name='remarks']").val($(tdDoms[7]).text());
            $("#msg-box").css("display","block");
        }
        if(th.hasClass("edit")){
            $(".submit-btn").show();
            var id = th.attr("value");
            //$("input").val("");
            $("input[name='serverid']").val(id);
        }
        //新增
        if(th.hasClass("add")){
            $("#s_form").find("input").val("");
            $("#msg-box").css("display","block");
            $("#space").css("display","none");
            $("#s_form").find("textarea").val("");
            $(".submit-btn").show();
        }

    });
});

//初始化列表
function initPage(isOrder,context,currentPage){
	var element = $('#bp-element');
	element.html("");
	
    contextTemp = context;
    orderTemp = isOrder;
    //列表展示
    $.post("<%=request.getContextPath()%>/server/getFileServers",{"isOrder":isOrder,"context":context,"currentPage":currentPage},function(data){
        var tbody = "";
        var pageUtil = data.pageUtil;
        $.each(data.list,function(index,entry){
            var icon = "";
            if(entry.ifcurrent == "1")icon = "<div class='coin4'></div>";
            tbody +=
                "<tr>"+
                    "<td>"+((pageUtil.currentPage-1)*pageUtil.pagesize*1+index+1)+"</td>"+
                    // "<td class='blue cursor fwq'>"+icon+entry.servername+"</td>"+
                    "<td class='blue cursor fwq' style=' width: 5px; padding-right: 0px;'>"+icon+"</td>"+
                    "<td>"+entry.servername+"</td>"+
                    "<td>"+entry.serverip+"</td>"+
                    "<td>"+entry.filepath+"</td>"+
                    "<td>"+entry.usedmemory+"/"+entry.allmemory+"</td>"+
                    "<td>"+entry.admin+"</td>"+
                    "<td>"+
                        "<a href='#' class='see show'>查看</a>"+
                        "<a href='#' value='"+entry.serverid+"'  class='modi1 show edit'>设置</a>"+
                   "</td>"+
                "</tr>";
        })
        $("#serverList").html(tbody);
        
        //搜索框赋值 (context,isOrder)
        $("#pageinp").val(pageUtil.context);
        $("#total").text(pageUtil.totalnum);
        //分页-s
            options = {
                bootstrapMajorVersion:3, //对应的bootstrap版本
                currentPage: pageUtil.currentPage, //当前页数，这里是用的EL表达式，获取从后台传过来的值
                numberOfPages: pageUtil.pagesize, //每页页数
                totalPages: pageUtil.totalpage,//总页数，这里是用的EL表达式，获取从后台传过来的值
                shouldShowPage:true,//是否显示该按钮
                itemTexts: function (type, page, current) {//设置显示的样式，默认是箭头
                    switch (type) {
                        case "first":
                            return "首页";
                        case "prev":
                            return "上一页";
                        case "next":
                            return "下一页";
                        case "last":
                            return "末页";
                        case "page":
                            return page;
                    }
                },
                //点击事件
                onPageClicked: function (event, originalEvent, type, page) {
                    initPage(isOrder,context,page);
                }
            };
            element.bootstrapPaginator(options);
            //分页-e
        
    },"json");
}
</script>
</head>

<body>
<!-- 顶部开始 -->
<div class="container-s">
	<div class="logo">
    	<a href="./index.html"><img src="<%=request.getContextPath()%>/img/logo.png"/></a>
    </div>
    <div class="top_search">
    	<!-- <form id="form_search" action="#" method="post">
            <a id="btn_search"></a>
            <input type="text" name="search" id="search" placeholder="请输入账号搜索..." />
        </form> -->
    </div>
    
    
    <div class="top_manage">
    	<div class="top_m_d">
        
        
        
        <script type="text/javascript">
			$(document).ready(function(){
					
				jQuery.navlevel2 = function(level1,dytime) {
					
				  $(level1).mouseenter(function(){
					  varthis = $(this);
					  delytime=setTimeout(function(){
						varthis.find('div').slideDown();
					},dytime);
					
				  });
				  $(level1).mouseleave(function(){
					 clearTimeout(delytime);
					 $(this).find('div').slideUp();
				  });
				  
				};
			  jQuery.navlevel2("div.mainlevel",200);
			});
			</script>
			
        	<div  class="mainlevel">
            	<span class="top_m_a"><%=user.getUsername()%></span>
            	<div>
                    <a href="#"><%=user.getUsername()%></a>
                    <a href="#" onclick="logout()">退出</a>
                </div>
            
            </div>
        </div>
    </div>
    
    <a id="top_set"></a>
    
    <div class="top_bell">
    	<span >2</span>
    </div>
    
</div>
<!-- 顶部结束 -->
<!-- 中部开始 -->
<!-- 左侧菜单开始 -->
<div class="left-nav">
    <ul class="ul-nav">
        <li>
            <a href="#">
                <i class="i1"></i>
                <cite>用户管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/registerManger">
                <i></i>
                <cite>注册管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/accountManger">
                <i></i>
                <cite>账号管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/fileServerManger">
                <i class="i3"></i>
                <cite>文件服务器管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/videoManger">
                <i class="i2"></i>
                <cite>视频文件管理</cite>
            </a>
        </li>
       <%--  <li>
            <a href="<%=request.getContextPath()%>/client/videoList">
                <i ></i>
                <cite>视频列表</cite>
            </a>
        </li> --%>
       <%--  <li>
            <a href="<%=request.getContextPath()%>/client/videoList?order=desc">
                <i></i>
                <cite>最近视频</cite>
            </a>
        </li> --%>
       
        <li>
            <a href="<%=request.getContextPath()%>/server/statusManger">
                <i class="i4"></i>
                <cite>状态管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/sceneManger">
                <i class="i5"></i>
                <cite>场景维护</cite>
            </a>
        </li>
    
    </ul>
</div>
<!-- 左侧菜单结束 -->
<!-- 右侧主体开始 -->
<div class="page-content">
	<div class="page-content-d">
    	<div class="page-c-nav">
        	<span>所有服务器（&nbsp;<font id="total" style="font-size: 14px;font-weight: bold;" color="#5db8f1">0</font>&nbsp;）</span>
            <%--<a href="#" class="add">新增</a>--%>
            <ul class='view-nav'>
                <li class="on"><a href="#"  class="add"><i class="i1"></i>新增</a></li>
            </ul>
        </div>
        
        <div class="clear h25"></div>
        <div class="ss">
        	<form action="#" id="ssform" method="post" ><input id="ssinput" type="text"  placeholder="请输入名称搜索..." /><a id="ssbtn">搜索</a></form>
        </div><%--<span class="gjjs">高级检索</span>--%>
        <div class="clear h10"></div>
        
        <div class="bg-cf">
        <table class="layui-table">
            <thead>
                <tr>
                    <th>序号</th>
                    <th></th>
                    <th>服务器名称</th>
                    <th>IP</th>
                    <th>视频文件存放目录</th>
                    <th>空间使用情况</th>
                    <th>负责人</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="serverList"></tbody>
        </table>
        
        <div class="clear h25"></div>
       <!--  <div class="page">
            <table border="0" align="center" cellpadding="0" class="page1">
                <tbody><tr><td>
                    <ul>
                        
                        <li><a class="avrp"><font></font></a></li> 
                        <li class="pagered"><a>1</a></li>
                        <li ><a>2</a></li>
                        <li><a>3</a></li>
                        <li><a>4</a></li>
                        <li><a class="nextpa"><font class="f14 block fl">下一页</font><i class="nextP fl"></i></a></li>
                        <div class="pagef"><form id="pageform" method="post"><span>到</span><input type="text" id="pageinp" name="page"/><span>页</span><a id="btn_page">确定</a></form></div>
                    </ul>
                </td></tr></tbody>
            </table>
        </div> -->
        <center><ul id='bp-element'></ul></center>
        <div class="clear h25"></div>
        </div>
        
    </div>
	
</div>
<!-- 右侧主体结束 -->
<!-- 中部结束 -->
<!--弹出窗口开始-->
<div id="msg-box"  class="msg-box">
    <div class="msg-body">
        <div class="msg-title">查看</div>
        <div class="close-btn msg-close" id="msg-close"></div>
    </div>
    <div class="msg-cont" style="text-align: center" >
        <form class="form-horizontal" style="padding-top: 6%;" role="form" id="s_form">
            <div class="form-group">
                <label for="firstname" class="col-sm-4 control-label">服务器名称：</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control " style="height: 24px;"
                           name="servername">
                </div>
            </div>
            <div class="form-group">
                <label for="lastname" class="col-sm-4 control-label">ip：</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" style="height: 24px;"
                           name="serverip">
                </div>
            </div>
            <div class="form-group">
                <label for="lastname" class="col-sm-4 control-label">视频文件存放目录：</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" style="height: 24px;"
                           name="filepath">
                </div>
            </div>
            <div class="form-group" id="space">
                <label for="lastname" class="col-sm-4 control-label">空间使用情况：</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" style="height: 24px;"
                           name="qwe">
                </div>
            </div>
            <div class="form-group">
                <label for="lastname" class="col-sm-4 control-label">负责人：</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" style="height: 24px;"
                           name="admin">
                </div>
            </div>
            <div class="form-group">
                <label for="lastname" class="col-sm-4 control-label">备注：</label>
                <div class="col-sm-3">
                    <textarea type="text" name="remarks" rows="4" cols="40"></textarea>

                </div>
            </div>
            <input type="text" name="serverid" style="display: none;">
        </form>
        <%--<div class="form">
            <form id="s_form">
                <input type="text" name="statusid" style="display: none;">
                &lt;%&ndash;<p>名称:<input type="text" name="statusname"></p>&ndash;%&gt;
                &lt;%&ndash;<p>严重等级:<input type="text" name="statuslevel"></p>&ndash;%&gt;
                &lt;%&ndash;<p>是否提示:<input type="text" name="ifnotify"></p>&ndash;%&gt;
                &lt;%&ndash;<p>是否报警:<input type="text" name="ifalarm"></p>&ndash;%&gt;
                &lt;%&ndash;<p>备注:<textarea type="text" name="remarks"></textarea>&ndash;%&gt;
            </form>
        </div>--%>
        <div class="buttons">
            <button type="button" class="close-btn btn btn-primary" >关闭</button>
            <button type="button" class="submit-btn btn btn-primary" style="display: none;" >提交</button>
        </div>
    </div>
</div>


</body>
</html>
